
//请注意，你需要替换代码中的path/to/imageX.png为实际的图像文件路径。这种方法确保了按钮一旦被点击一次就不会再响应点击事件，并且通过getClickOrder函数可以获取按钮被点击的实际顺序。同时，按钮上的数字将直接显示在按钮上，而不是通过更改图像来实现。

import QtQuick 2.15
import QtQuick.Controls 2.15

ApplicationWindow {
    id: appWindow
    visible: true
    width: 640
    height: 480

    // 全局点击计数器
    property int globalClickCounter: 0

    // 创建四个按钮，每个按钮使用Image组件显示图像，并在上面覆盖Text组件显示数字
    Item {
        id: button1
        width: 100
        height: 100
        x: 20
        y: 20

        Image {
            id: image1
            source: "path/to/image1.png" // 替换为你的图片路径
            fillMode: Image.PreserveAspectFit
            anchors.fill: parent
        }

        Text {
            id: text1
            text: ""
            anchors.centerIn: parent
            color: "white"
            font.pointSize: 20
            visible: globalClickCounter > 0 && globalClickCounter <= 4
        }

        MouseArea {
            anchors.fill: parent
            onClicked: {
                if (globalClickCounter < 4 && !button1.disabled) {
                    globalClickCounter++
                    text1.text = globalClickCounter.toString()
                    button1.disabled = true // 禁用按钮
                    checkAllButtonsClicked()
                }
            }
        }
    }

    Item {
        id: button2
        width: 100
        height: 100
        x: 20
        y: 140

        Image {
            id: image2
            source: "path/to/image2.png"
            fillMode: Image.PreserveAspectFit
            anchors.fill: parent
        }

        Text {
            id: text2
            text: ""
            anchors.centerIn: parent
            color: "white"
            font.pointSize: 20
            visible: globalClickCounter > 0 && globalClickCounter <= 4
        }

        MouseArea {
            anchors.fill: parent
            onClicked: {
                if (globalClickCounter < 4 && !button2.disabled) {
                    globalClickCounter++
                    text2.text = globalClickCounter.toString()
                    button2.disabled = true
                    checkAllButtonsClicked()
                }
            }
        }
    }

    Item {
        id: button3
        width: 100
        height: 100
        x: 20
        y: 260

        Image {
            id: image3
            source: "path/to/image3.png"
            fillMode: Image.PreserveAspectFit
            anchors.fill: parent
        }

        Text {
            id: text3
            text: ""
            anchors.centerIn: parent
            color: "white"
            font.pointSize: 20
            visible: globalClickCounter > 0 && globalClickCounter <= 4
        }

        MouseArea {
            anchors.fill: parent
            onClicked: {
                if (globalClickCounter < 4 && !button3.disabled) {
                    globalClickCounter++
                    text3.text = globalClickCounter.toString()
                    button3.disabled = true
                    checkAllButtonsClicked()
                }
            }
        }
    }

    Item {
        id: button4
        width: 100
        height: 100
        x: 20
        y: 380

        Image {
            id: image4
            source: "path/to/image4.png"
            fillMode: Image.PreserveAspectFit
            anchors.fill: parent
        }

        Text {
            id: text4
            text: ""
            anchors.centerIn: parent
            color: "white"
            font.pointSize: 20
            visible: globalClickCounter > 0 && globalClickCounter <= 4
        }

        MouseArea {
            anchors.fill: parent
            onClicked: {
                if (globalClickCounter < 4 && !button4.disabled) {
                    globalClickCounter++
                    text4.text = globalClickCounter.toString()
                    button4.disabled = true
                    checkAllButtonsClicked()
                }
            }
        }
    }

    // 创建确认按钮，只有在所有按钮都被点击后才能被激活
    Button {
        id: confirmButton
        text: "确认"
        x: 20
        y: 450
        enabled: allButtonsClicked
        onClicked: {
            // 返回所有按钮被点击的顺序并退出QML程序
            console.log("按钮被点击的顺序:", getClickOrder());
            Qt.quit();
        }
    }

    // 函数用于检查所有按钮是否都被点击过
    function checkAllButtonsClicked() {
        allButtonsClicked = button1.disabled && button2.disabled && button3.disabled && button4.disabled;
        if (allButtonsClicked) {
            confirmButton.enabled = true;
        }
    }

    // 函数用于返回按钮被点击的顺序次数
    function getClickOrder() {
        var order = [];
        if (text1.text !== "") order.push(parseInt(text1.text));
        if (text2.text !== "") order.push(parseInt(text2.text));
        if (text3.text !== "") order.push(parseInt(text3.text));
        if (text4.text !== "") order.push(parseInt(text4.text));
        return order;
    }

    // 属性用于跟踪所有按钮是否都被点击过
    property bool allButtonsClicked: false
}